<template>
  <div class="mod-config">
    <el-form size="mini" :inline="true" :model="searchForm" @keyup.enter.native="getDataList()">
      <el-form-item >
        <el-input v-model="searchForm.key" placeholder="订单号" @change="getDataList()" clearable></el-input>
      </el-form-item>
      <el-form-item>
        <div class="block">
          <span class="demonstration" >&nbsp;&nbsp;下单日期：</span>
          <el-date-picker
            v-model="searchForm.date"
            type="daterange"
            align="right"
            unlink-panels
            value-format="yyyy-MM-dd"
            @change="getDataList"
            range-separator="-"
            start-placeholder="start"
            end-placeholder="end"
            :picker-options="pickerOptions">
          </el-date-picker>
        </div>
      </el-form-item>
      <el-form-item label="订单状态">
        <template>
          <el-select v-model="searchForm.orderStatus" @change="getDataList" placeholder="请选择">
            <el-option
              v-for="item in orderStatus"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </template>
      </el-form-item>
      <el-form-item label="支付类型">
        <template>
          <el-select v-model="searchForm.paymentType"  @change="getDataList" placeholder="请选择">
            <el-option
              v-for="item in paymentTypes"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </template>
      </el-form-item>
    </el-form>
    <el-table
      size="mini"
      :data="dataList"
      border
      v-loading="dataListLoading"
      style="width: 100%">
      <el-table-column
        header-align="center"
        align="center"
        width="180px"
        label="订单编号">
        <template slot-scope="scope">
          <el-link @click="showOrderDetail(scope.row)" style="font-size: 12px" type="primary">{{ scope.row.orderId }}</el-link>
        </template>
      </el-table-column>
      <el-table-column
        prop="totalPay"
        header-align="center"
        align="center"
        label="总金额">
        <template slot-scope="scope">
          <span style="color: #ff8b8b">{{ (scope.row.totalPay/100).toFixed(2) + ' ￥'}}</span>
        </template>
      </el-table-column>
      <el-table-column
        header-align="center"
        align="center"
        label="实付金额">
        <template slot-scope="scope">
          <span style="color: #ff8b8b">{{ (scope.row.actualPay/100).toFixed(2) + ' ￥'}}</span>
        </template>
      </el-table-column>
      <el-table-column
        header-align="center"
        align="center"
        label="支付类型">
        <template slot-scope="scppe">
          <span style="color: #30a7c5" v-if="scppe.row.paymentType">在线支付</span>
          <span style="color: mediumseagreen" v-else>货到付款</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="sourceType"
        header-align="center"
        align="center"
        label="订单来源">
        <template slot-scope="scope">
          <span v-if="scope.row.sourceType === 1">app端</span>
          <span v-if="scope.row.sourceType === 2">pc端</span>
          <span v-if="scope.row.sourceType === 3">M端</span>
          <span v-if="scope.row.sourceType === 4">微信端</span>
          <span v-if="scope.row.sourceType === 5">手机qq端</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="sourceType"
        header-align="center"
        align="center"
        label="订单状态">
        <template slot-scope="scope">
          <span style="color: #3c9800" v-if="scope.row.status === 1">未付款</span>
          <span style="color: #006e37" v-if="scope.row.status === 2">已付款</span>
          <span style="color: #006ba0" v-if="scope.row.status === 3">已发货</span>
          <span style="color: #0106fd" v-if="scope.row.status === 4">交易成功</span>
          <span style="color: #5f0394" v-if="scope.row.status === 5">交易关闭</span>
          <span style="color: #a501fd" v-if="scope.row.status === 6">已评价</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="createTime"
        header-align="center"
        align="center"
        label="创建时间">
      </el-table-column>
      <el-table-column
        fixed="right"
        header-align="center"
        align="center"
        width="150"
        label="操作">
        <template slot-scope="scope">
          <el-button
            type="primary" plain v-if="scope.row.status == 2" size="mini" @click="addOrUpdateHandle(scope.row)">修改
          </el-button>
          <el-button
            type="warning" plain v-if="scope.row.status == 2" size="mini" @click="showDeliverGoodsHandle(scope.row)">发货
          </el-button>
          <span v-else>无</span>
        </template>
      </el-table-column>
    </el-table>
    <p> </p>
    <el-pagination
      @size-change="sizeChangeHandle"
      @current-change="currentChangeHandle"
      :current-page="searchForm.page"
      :page-sizes="[5, 10, 20, 50, 100]"
      :page-size="searchForm.limit"
      :total="totalPage"
      layout="total, sizes, prev, pager, next, jumper">
    </el-pagination>

    <!--显示详细信息-->
    <el-drawer
      size="60%"
      title="详细信息"
      :before-close="cancelShowOrderDetailForm"
      :visible.sync="showOrderDetailDialogVisible"
      ref="updateC3Drawer">
      <!-- 对话框主体内容 -->
      <div class="demo-drawer__content">
        <el-row :gutter="20">
          <el-col :span="1">&nbsp;</el-col>
          <el-col :span="19">
            <el-tabs v-model="activeName" style="left: 5px" @tab-click="handleClick">
              <el-tab-pane label="基本信息" name="first">
                <el-descriptions column= 2 >
                  <el-descriptions-item label-style="font-weight: bold" label="订单编号">{{orderDetailForm.orderId}}</el-descriptions-item>
                  <el-descriptions-item ></el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="总金额">
                    <span style="color: #ff8b8b">{{ (orderDetailForm.totalPay/100).toFixed(2) + ' ￥'}}</span>
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="实付金额">
                    <span style="color: #ff8b8b">{{ (orderDetailForm.actualPay/100).toFixed(2) + ' ￥'}}</span>
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="订单状态">
                    <span style="color: #3c9800" v-if="orderDetailForm.status === 1">未付款</span>
                    <span style="color: #006e37" v-if="orderDetailForm.status === 2">已付款</span>
                    <span style="color: #006ba0" v-if="orderDetailForm.status === 3">已发货</span>
                    <span style="color: #0106fd" v-if="orderDetailForm.status === 4">交易成功</span>
                    <span style="color: #5f0394" v-if="orderDetailForm.status === 5">交易关闭</span>
                    <span style="color: #a501fd" v-if="orderDetailForm.status === 6">已评价</span>
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="支付类型">
                    <span style="color: #30a7c5" v-if="orderDetailForm.paymentType">在线支付</span>
                    <span style="color: mediumseagreen" v-else>货到付款</span>
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="创建时间">
                    {{orderDetailForm.createTime}}
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="付款时间">
                    {{orderDetailForm.paymentTime === null ? '无' : orderDetailForm.paymentTime}}
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="发货时间">
                    {{orderDetailForm.consignTime === null ? '无' : orderDetailForm.consignTime}}
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="交易完成时间">
                    {{orderDetailForm.endTime === null ? '无' : orderDetailForm.endTime}}
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="交易关闭时间">
                    {{orderDetailForm.closeTime === null ? '无' : orderDetailForm.closeTime}}
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="评价时间">
                    {{orderDetailForm.commentTime === null ? '无' : orderDetailForm.commentTime}}
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="订单来源">
                    <span v-if="orderDetailForm.sourceType === 1">app端</span>
                    <span v-if="orderDetailForm.sourceType === 2">pc端</span>
                    <span v-if="orderDetailForm.sourceType === 3">M端</span>
                    <span v-if="orderDetailForm.sourceType === 4">微信端</span>
                    <span v-if="orderDetailForm.sourceType === 5">手机qq端</span>
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="买家昵称">
                    {{orderDetailForm.buyerNick}}
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="买家评价">
                    <span v-if="orderDetailForm.buyerRate === 0">未评价</span>
                    <span v-else>已评价</span>
                  </el-descriptions-item>
                </el-descriptions>
              </el-tab-pane>
              <el-tab-pane label="物流信息" name="sell">
                <el-descriptions :column= "2" >
                  <el-descriptions-item label-style="font-weight: bold" label="物流名称 ">{{orderDetailForm.shippingName}}</el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="物流单号 ">{{orderDetailForm.shippingCode}}</el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="收货人 ">{{orderDetailForm.receiver}}</el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="收货人手机 ">{{orderDetailForm.receiverMobile}}</el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="收货人邮编 ">{{orderDetailForm.receiverZip}}</el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="发票类型 ">
                    <span v-if="orderDetailForm.invoiceType === 0">无发票</span>
                    <span v-if="orderDetailForm.invoiceType === 1">普通发票</span>
                    <span v-if="orderDetailForm.invoiceType === 2">电子发票</span>
                    <span v-if="orderDetailForm.invoiceType === 3">增值税发票</span>
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="收获地址 ">
                    {{orderDetailForm.receiverState}}（省） {{orderDetailForm.receiverCity}}（市） {{orderDetailForm.receiverDistrict}}（县） {{orderDetailForm.receiverAddress}}
                  </el-descriptions-item>
                </el-descriptions>
              </el-tab-pane>
              <el-tab-pane label="订单详情" name="detail">
                <el-table
                  :data="detailOrders"
                  size="mini"
                  style="width: 100%;left: 20px">
                  <el-table-column
                    label="#"
                    type="index">
                  </el-table-column>
                  <el-table-column
                    label="标题"
                    prop="title">
                    <template slot-scope="scope">
                      <el-popover
                        placement="top-start"
                        title="描述"
                        width="200"
                        trigger="hover"
                        :content="scope.row.title">
                        <el-tag size="mini" type="primary" slot="reference">. . .</el-tag>
                      </el-popover>
                    </template>
                  </el-table-column>
                  <el-table-column
                      v-for="(item) in this.params"
                      :key="item"
                      :prop="item.id + ''"
                      :label="item.name">
                  </el-table-column>
                  <el-table-column
                    label="图片">
                    <template slot-scope="scope">
                      <img style="width:100px" class="photo" :src="scope.row.image" alt="">
                    </template>
                  </el-table-column>
                  <el-table-column
                    label="数量"
                    prop="num">
                  </el-table-column>
                  <el-table-column
                    label="价格"
                    prop="price">
                    <template slot-scope="scope">
                      {{(scope.row.price/100).toFixed(2) + ' ￥'}}
                    </template>
                  </el-table-column>
                </el-table>
              </el-tab-pane>
            </el-tabs>
          </el-col>
        </el-row>
      </div>
    </el-drawer>

    <!--修改信息-->
    <el-drawer
      size="40%"
      title="修改信息"
      :before-close="cancelShowUpdateOrderForm"
      :visible.sync="showUpdateOrderDialogVisible">
      <!-- 对话框主体内容 -->
      <div class="demo-drawer__content">
        <el-row :gutter="20">
          <el-col :span="1">&nbsp;</el-col>
          <el-col :span="19">
            <el-tabs v-model="activeName" style="left: 5px">
              <el-tab-pane label="基本信息" name="first">
                <el-descriptions :column= "2" >
                  <el-descriptions-item label-style="font-weight: boldl; width" label="订单">{{updateOrderForm.orderId}}</el-descriptions-item>
                  <el-descriptions-item ></el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="总金额">
                    <span style="color: #ff8b8b">{{ (updateOrderForm.totalPay/100).toFixed(2) + ' ￥'}}</span>
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="实付金额">
                    <span style="color: #ff8b8b">{{ (updateOrderForm.actualPay/100).toFixed(2) + ' ￥'}}</span>
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="订单状态">
                      <span style="color: #3c9800" v-if="updateOrderForm.status === 1">未付款</span>
                      <span style="color: #006e37" v-if="updateOrderForm.status === 2">已付款</span>
                      <span style="color: #006ba0" v-if="updateOrderForm.status === 3">已发货</span>
                      <span style="color: #0106fd" v-if="updateOrderForm.status === 4">交易成功</span>
                      <span style="color: #5f0394" v-if="updateOrderForm.status === 5">交易关闭</span>
                      <span style="color: #a501fd" v-if="updateOrderForm.status === 6">已评价</span>
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="买家昵称">
                    {{updateOrderForm.buyerNick}}
                  </el-descriptions-item>
                </el-descriptions>
                <p> </p>
                <el-form size="mini">
                    <el-form-item label-width="100px" style="width: 450px" label-style="font-weight: bold" label="收货人： ">
                      <el-input v-model="updateOrderForm.receiver"></el-input>
                    </el-form-item>
                    <el-form-item label-width="100px" style="width: 450px"  label-style="font-weight: bold" label="收货人手机： ">
                      <el-input v-model="updateOrderForm.receiverMobile"></el-input>
                    </el-form-item>
                    <el-form-item label-width="100px" style="width: 450px" label-style="font-weight: bold" label="收货人邮编： ">
                      <el-input v-model="updateOrderForm.receiverZip"></el-input>
                    </el-form-item>
                    <el-form-item label-width="100px" style="width: 450px" label-style="font-weight: bold" label="发票类型： ">
                      <el-select v-model="updateOrderForm.invoiceType">
                        <el-option label="无发票"   :value="0"></el-option>
                        <el-option label="普通发票" :value="1"></el-option>
                        <el-option label="电子发票" :value="2"></el-option>
                        <el-option label="增值税发票" :value="3"></el-option>
                      </el-select>
                    </el-form-item>
                    <el-form-item label-width="100px" label-style="font-weight: bold" label="收获地址： ">
                      <el-select style="width: 100px" v-model="proData" placeholder="省" @change="handleProChange">
                        <el-option
                          v-for="item in ProCityCountry.proData_"
                          :key="item.pk"
                          :label="item.pv"
                          :value="item.pk">
                        </el-option>
                      </el-select>
                      <el-select style="width: 100px" v-model="cityData" placeholder="市" @change="handleCityhange">
                        <el-option
                          v-for="item in ProCityCountry.cityData_.filter(city => city.pk === proData)"
                          :key="item.ck"
                          :label="item.cv"
                          :value="item.ck">
                        </el-option>
                      </el-select>
                      <el-select style="width: 100px" v-model="countryData" placeholder="县" >
                        <el-option
                          v-for="item in ProCityCountry.countryData_.filter(country => country.ck === cityData)"
                          :key="item.cyk"
                          :label="item.cyv"
                          :value="item.cyk">
                        </el-option>
                      </el-select>
                    </el-form-item>
                    <el-form-item label-style="font-weight: bold" label="详细地址">
                      <el-input style="width: 250px" type="textarea" v-model="updateOrderForm.receiverAddress"></el-input>
                    </el-form-item>
                  </el-form>
              </el-tab-pane>
            </el-tabs>
          </el-col>
        </el-row>
      </div>
      <!-- 对话框的操作按钮 -->
      <div class="demo-drawer__footer" style="
            position:absolute;
            left:300px;
            top: 80%">
        <el-button @click="cancelShowUpdateOrderForm">取 消</el-button>
        <el-button type="primary" @click="updateOrder">{{'修 该' }}</el-button>
      </div>
    </el-drawer>

    <!--发货-->
    <el-drawer
      size="40%"
      title="发货"
      :before-close="cancelShowDeliverGoodsForm"
      :visible.sync="showDeliverGoods">
      <!-- 对话框主体内容 -->
      <div class="demo-drawer__content">
        <el-row :gutter="20">
          <el-col :span="1">&nbsp;</el-col>
          <el-col :span="19">
            <el-tabs v-model="activeName" style="left: 5px">
              <el-tab-pane label="基本信息" name="first">
                <el-descriptions :column= "2" >
                  <el-descriptions-item label-style="font-weight: boldl; width" label="订单">{{updateOrderForm.orderId}}</el-descriptions-item>
                  <el-descriptions-item ></el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="总金额">
                    <span style="color: #ff8b8b">{{ (updateOrderForm.totalPay/100).toFixed(2) + ' ￥'}}</span>
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="实付金额">
                    <span style="color: #ff8b8b">{{ (updateOrderForm.actualPay/100).toFixed(2) + ' ￥'}}</span>
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="订单状态">
                    <span style="color: #3c9800" v-if="updateOrderForm.status === 1">未付款</span>
                    <span style="color: #006e37" v-if="updateOrderForm.status === 2">已付款</span>
                    <span style="color: #009ecd" v-if="updateOrderForm.status === 3">已发货</span>
                    <span style="color: #006ba0" v-if="updateOrderForm.status === 4">交易成功</span>
                    <span style="color: #0106fd" v-if="updateOrderForm.status === 5">交易关闭</span>
                    <span style="color: #a501fd" v-if="updateOrderForm.status === 6">已评价</span>
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="买家昵称">
                    {{updateOrderForm.buyerNick}}
                  </el-descriptions-item>
                </el-descriptions>
                <el-descriptions :column="2">
                  <el-descriptions-item label-style="font-weight: bold" label="收货人 ">{{updateOrderForm.receiver}}</el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="收货人手机 ">{{updateOrderForm.receiverMobile}}</el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="收货人邮编 ">{{updateOrderForm.receiverZip}}</el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="发票类型 ">
                    <span v-if="updateOrderForm.invoiceType === 0">无发票</span>
                    <span v-if="updateOrderForm.invoiceType === 1">普通发票</span>
                    <span v-if="updateOrderForm.invoiceType === 2">电子发票</span>
                    <span v-if="updateOrderForm.invoiceType === 3">增值税发票</span>
                  </el-descriptions-item>
                  <el-descriptions-item label-style="font-weight: bold" label="收获地址 ">
                    {{updateOrderForm.receiverState}}（省） {{updateOrderForm.receiverCity}}（市） {{updateOrderForm.receiverDistrict}}（县） {{updateOrderForm.receiverAddress}}
                  </el-descriptions-item>
                </el-descriptions>
                <p>物流</p>
                物流名称：<el-input style="width: 300px"  v-model="updateOrderForm.shippingName"/><br>
                物流单号：<el-input style="width: 300px"  v-model="updateOrderForm.shippingCode"/>
              </el-tab-pane>
            </el-tabs>
          </el-col>
        </el-row>
      </div>
      <!-- 对话框的操作按钮 -->
      <div class="demo-drawer__footer" style="
            position:absolute;
            left:300px;
            top: 80%">
        <el-button @click="cancelShowDeliverGoodsForm">取 消</el-button>
        <el-button type="primary" @click="deliverGoods">{{'发 货' }}</el-button>
      </div>
    </el-drawer>
  </div>
</template>

<script>
  import ProCityCountry from '../../components/order/proCityCountry.js'

  export default {
    data () {
      return {
        // 省 市 区
        proData: '',
        cityData: '',
        countryData: '',
        activeName: 'first',
        searchForm: {
          key: '',
          page: 1,
          limit: 10,
          date: [],
          orderStatus: '',
          paymentType: ''
        },
        totalPage: 0,
        dataList : [],
        options: [],
        value: '',
        showUpdateOrderDialogVisible: false,
        showOrderDetailDialogVisible: false,
        showDeliverGoods:false,
        paymentTypes: [
          { value: '', label: '请选择'},
          { value: '1', label: '在线支付'},
          { value: '2', label: '货到付款'}
        ],
        actionProp: {
          value: 'pk',
          label: 'pv'
        },
        orderStatus: [
          { value: '', label: '请选择'},
          { value: '1', label: '未付款'},
          { value: '2', label: '已付款'},
          { value: '3', label: '已发货'},
          { value: '4', label: '未确认'},
          { value: '5', label: '交易成功'},
          { value: '6', label: '已评价'}
        ],
        // 日期选择器
        pickerOptions: {
          shortcuts: [{
            text: '最近一周',
            onClick(picker) {
              const end = new Date()
              const start = new Date()
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
              picker.$emit('pick', [start, end])
            }
          }]},
        orderDetailForm: {
          orderId: '',
          totalPay: '',
          actualPay: '',
          paymentType: '',
          postFee: '',
          createTime: '',
          shippingName: '',
          shippingCode: '',
          userId: '',
          buyerMessage: '',
          buyerNick: '',
          buyerRate: '',
          receiverState: '',
          receiverCity: '',
          receiverDistrict: '',
          receiverAddress: '',
          receiverMobile: '',
          receiverZip: '',
          receiver: '',
          invoiceType: '',
          sourceType: ''
        },
        updateOrderForm: {
          orderId: '',
          totalPay: '',
          actualPay: '',
          paymentType: '',
          postFee: '',
          createTime: '',
          shippingName: '',
          shippingCode: '',
          userId: '',
          buyerMessage: '',
          buyerNick: '',
          buyerRate: '',
          receiverState: '',
          receiverCity: '',
          receiverDistrict: '',
          receiverAddress: '',
          receiverMobile: '',
          receiverZip: '',
          receiver: '',
          invoiceType: '',
          sourceType: ''
        },
        // 订单详情
        detailOrders: [],
        params: [],
        ProCityCountry
      }
    },
    components: {
      // AddOrUpdate
      // ProCityCountry
    },
    created () {
      this.getDataList()
      console.log(ProCityCountry)
    },
    methods: {
      handleProChange(value) {
        this.cityData = ''
        this.countryData = ''
      },
      handleCityhange(value) {
        this.countryData = ''
      },
      handleClick() {
        // 点击详细信息查询
        if (this.activeName === 'detail') {
          this.$http.get('order-server/orderdetail/infos/' + this.orderDetailForm.orderId).then(resp => {
            this.detailOrders = resp.data.orderDetail
            this.params = resp.data.orderDetail[0].specParamVO
            this.detailOrders.forEach(detail => {
              detail.specParamVO.forEach(param => {
                detail[param.id + ''] = param.value
              })
            })
          }).catch(error => {
            this.$message.warning(error.response.data.msg)
          })
        }
      },
      cancelShowOrderDetailForm () {
        this.activeName = 'first'
        this.showOrderDetailDialogVisible = false
      },
      cancelShowUpdateOrderForm () {
        this.updateOrderForm = Object.assign({}, this.$options.data().formData)
        this.showUpdateOrderDialogVisible = false
      },
      cancelShowDeliverGoodsForm () {
        this.updateOrderForm = Object.assign({}, this.$options.data().formData)
        this.showDeliverGoods = false
      },
      // 获取数据列表
      getDataList () {
        this.dataListLoading = true
        if (this.searchForm.date === null) {
          this.searchForm.date = []
        }
        // 封装分页查询对象
        this.$http.post('order-server/order/list', this.searchForm).then(({data}) => {
          if (data && data.code === 0) {
            this.dataList = data.page.list
            this.totalPage = data.page.totalCount
          } else {
            this.dataList = []
            this.totalPage = 0
          }
          this.dataListLoading = false

        })
      },
      // 每页数
      sizeChangeHandle (val) {
        console.log(val)
        this.searchForm.limit = val
        this.searchForm.page = 1
        this.getDataList()
      },
      // 当前页
      currentChangeHandle (val) {
        this.searchForm.page = val
        this.getDataList()
      },
      // 显示详细信息
      showOrderDetail (row) {
        this.orderDetailForm = row
        console.log(this.orderDetailForm)
        this.showOrderDetailDialogVisible = true
      },
      addOrUpdateHandle (row) {
        var _obj = JSON.stringify(row)
        this.updateOrderForm = JSON.parse(_obj);
        // 设置城市
        let a = ProCityCountry.proData_.find(item => item.pv === row.receiverState)
        this.proData = a.pk
        // 设置市
        let b = ProCityCountry.cityData_.find(item => item.cv === row.receiverCity)
        this.cityData = b.ck
        // 设置区
        let c = ProCityCountry.countryData_.find(item => item.cyv === row.receiverDistrict)
        this.countryData = c.cyk
        // this.updateOrderForm.receiverState = a.pk
        this.showUpdateOrderDialogVisible = true
      },
      showDeliverGoodsHandle (row) {
        // 实现深拷贝
        var _obj = JSON.stringify(row)
        this.updateOrderForm = JSON.parse(_obj);
        this.showDeliverGoods = true
      },
      updateOrder () {
        // 设置城市
        let a = ProCityCountry.proData_.find(item => item.pk === this.proData)
        this.updateOrderForm.receiverState = a.pv
        // 设置市
        let b = ProCityCountry.cityData_.find(item => item.ck === this.cityData)
        this.updateOrderForm.receiverCity = b.cv
        // 设置区
        let c = ProCityCountry.countryData_.find(item => item.cyk === this.countryData)
        this.updateOrderForm.receiverDistrict = c.cyv

        // 修改
        this.$http.post('order-server/order/update', this.updateOrderForm).then(resp => {
          if (resp.data.code === 0) {
            this.$message.success('修改成功!')
            this.showUpdateOrderDialogVisible = false
          } else {
            this.$message.error(resp.data.message)
          }
        }).catch(error => {
          this.$message.warning(error.response.data.msg)
        })
      },
      deliverGoods () {
        // 发货
        this.updateOrderForm.consignTime = this.DateFormat(new Date(), "yyyy-MM-dd HH:mm:ss")
        this.updateOrderForm.status = 3
        this.$http.post('order-server/orderstatus/update', this.updateOrderForm).then(resp => {
          if (resp.data.code === 0) {
            this.$message.success('修改成功!')
            this.showDeliverGoods = false
          } else {
            this.$message.error(resp.data.message)
          }
        }).catch(error => {
          this.$message.warning(error.response.data.msg)
        })
      },
      DateFormat (date, fmt) {
        var o = {
          "M+": date.getMonth() + 1, //月份
          "d+": date.getDate(), //日
          "H+": date.getHours(), //小时
          "m+": date.getMinutes(), //分
          "s+": date.getSeconds(), //秒
          "q+": Math.floor((date.getMonth() + 3) / 3), //季度
          "S": date.getMilliseconds() //毫秒
        }
        if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length))
        for (var k in o)
          if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)))
        return fmt
      }
    }
  }
</script>
